<template>
  <v-app id="inspire">
    <v-app-bar
        app
        color="white"
        flat
    >
      <v-avatar
          :color="$vuetify.breakpoint.smAndDown ? 'grey darken-1' : 'transparent'"
          size="32"
      ></v-avatar>

      <v-tabs
          centered
          class="ml-n9"
          color="grey darken-1"
      >
        <v-tab
            v-for="(link,i) in links"
            :key="i"
            :to="{name:'main',params:{type:link.path}}"
        >
          {{ link.name }}
        </v-tab>
      </v-tabs>

      <v-avatar
          class="hidden-sm-and-down"
          color="grey darken-1 shrink"
          size="32"
      ></v-avatar>
    </v-app-bar>

    <v-main class="grey lighten-3  ">
      <router-view  />
    </v-main>
  </v-app>
</template>

<script>

export default {

  data: () => ({
    links: [
      {name:'日常博客',path:'blog'},
      {name:'论文阅读',path:'paper'},
      {name:'课设项目',path:'project'},

    ],

  }),


}
</script>